
<style>
/*阿里云播放器*/
    body {
        background: #f8f8f8;
        overflow-x: hidden;
    }
    .videoPlayCon{
        width:1200px;
        margin:0 auto;
        overflow: hidden;
        margin-top:30px;
    }
    .PlayTop {
        height:45px;
        line-height:45px;
    }
    .PlayTop ul li {
        float: left;
        color: #999;
    }
    .PlayTop ul li span{
        margin-left: 19px;
        margin-right: 15px;
    }
    .PlayVideo{
        width:100%;
        position: relative;
        background: #000;
    }
    .videMenu{
        width:398px;
        height:508px;
        background: #fff;
        position: absolute;
        right:-538px;
        top:0;
        overflow: hidden;
    }
    .videMenu h1 {
        margin-left:20px;
        font-size:16px;
        width:100%;
        height:44px;
        line-height:44px;
        border-top:1px solid #dddddd;
        border-bottom:1px solid #dddddd;
    }
    .videMenu h1 a {
        display: inline-block;
        height:42px;
    }
    .PlayDetail {
        font-weight:normal;
    }
    .details {
        width:353px;
        line-height:24px;
        font-size:14px;
        text-indent:24px;
        margin-left:20px;
    }
    .PlayCatalog {
        margin-left:48px;
    }
    .PlayBot {
        border-bottom:2px solid #30a3ff;
    }
    .details_bot {
        border-bottom:2px solid #30a3ff;
    }
    .videMenu>ul {
        height:494px;
        overflow: hidden;
        overflow-y:visible;
        position: relative;
    }
    .videMenu>ul>li {
        height:34px;
        line-height:34px;
        padding-left:20px;
        font-size:14px;
    }

    .MenuBg {
        background: #f5f5f5;
    }
    .MenuBg span {
        padding-right:28px;
    }
    .videSlideMenu span {
        padding-right:28px;
    }
    .videSlideMenu b {
        color: #a1a1a1;
        font-weight:normal;
        padding-left:123px;
    }
    .videoMark {
        cursor: pointer;
        position: absolute;
        top:34%;
        left:0;
        z-index: 1;
        width:25px;
        height:65px;
        background: url("them/imgs/videMatk.jpg") no-repeat;
    }
    .showVideo {
        cursor: pointer;
        position: absolute;
        top:34%;
        right:0;
        width:25px;
        height:65px;
        background: url("them/imgs/videoMenu.jpg")
    }
    .RevelanVideoCon {
        width:868px;
        float: left;
    }
    .RevelanVideo {
        width:100%;
        height:241px;
        background: #fff;
        border:1px solid #dddddd;
        margin-bottom:20px;
    }
    .RevelanVideo h1 {
        font-size:16px;
        height:49px;
        line-height:49px;
        margin-left:20px;
        border-bottom:1px solid #ddd;
    }
    .RevelanVideo ul {
        margin:20px 0 0 20px;
    }
    .RevelanVideo ul li {
        float: left;
        margin-left:36px;
    }
    .RevelanVideo ul li:first-child {
        margin-left:0px;
    }
    .RevelanVideo ul li a,.RevelanVideo ul li a img {
        width:181px;
        height:114px;
    }
    .RevelanVideo ul li p {
        width:181px;
        margin-top:10px;
    }

    .recentBrowse{
        width:308px;
        background: #fff;
        float: right;
        border:1px solid #ddd;
        margin-bottom: 30px;
    }
    .recentBrowse h1 {
        margin-left:14px;
        height:53px;
        border-bottom:1px solid #ddd;
        line-height:53px;
        padding-left:30px;
        font-size:16px;
        background: url("them/imgs/zfx.png") no-repeat 0 20px;
    }
    .recentBrowse ul {
        margin:17px 0 0 14px;
    }
    .recentBrowse ul li {
        padding-left:20px;
        margin-bottom:15px;
        background: url("them/imgs/zfxs.png") no-repeat 0 5px;
    }
    .recentBrowse ul li a {
        font-size:14px;
        width: 252px;
	    height: 18px;
	    display: block;
	    white-space: nowrap;
	    text-overflow: ellipsis;
	    overflow: hidden;
    }
	.recentBrowse ul li a:hover{
		color:#30a3fe;
		text-decoration: underline;
	}
	.RevelanVideo ul li p:hover{
		color:#30a3fe;
		cursor: pointer;
		text-decoration: underline;
	}
.chapter{
    width:100%;
    margin:0;
    background-color:#fff;
    font-size:14px;
    color:#666;
    height:508px;
    overflow: hidden;
    overflow-y: auto;
}
.chapterTop {
    padding-left:19px;
    width:100%;
    height:34px;
    line-height:34px;
}
.course{
    padding-left:19px;
    font-size:14px;
    width:100%;
    overflow: hidden;
    line-height:34px;
    background: #fff;
}
.course:hover{
    color:#30a3ff;
}
.vediotime{
    margin-left:650px;
    color: #999999;
}
.evaluateCon{
    width:868px;
    background: #fff;
    margin-bottom:60px;
    border:1px #ddd solid;
    margin-top:30px;
    overflow: hidden;
}

.evaCenter{
    width:830px;
    margin:10px 0 0 20px;
}

.evaCon {
    width:100%;
    margin:0 auto

}
.evaCon  .f-comment-write .f-input-comment {
    margin-left: 16px;
    float: left;
    width: 645px;
    height: 95px;
    resize: none;
}
.f-usercomment{
    width:731px;
}
.rating p {
    display: inline-block;
    width:16px;
    height:16px;
    background: url("them/imgs/star-off.png") no-repeat;
    cursor: pointer;
}
.rating .filled {
    background: url("them/imgs/star-on.png") no-repeat;
}
.f-username{
    position: relative;
    top: 20px;
    right:-134px;
}
    .videoname{
        display: block;
    }
.chapterTop span{
    font-size: 16px;
}
.chapterTop span.Bigchaper{
    display: block;
    float: left;
    width: 79px;
    text-align: center;
    margin-right: 11px;
}
.chaperName{
    display: block;
    font-size: 14px;
    float: left;
    width: 79px;
    height: 37px;
    background: #696969;
    color: #fff;
    text-align: center;
    line-height: 37px;
    margin-right: 11px;
}
.videoname{
    display: block;
    background: #fff;
    clear: both;
    height: 30px;
    line-height:30px;
    padding-left: 48px;
}
.videoname b{
    cursor: pointer;
    font-weight: normal;
    color: #999;
}
.videoTime{
    float: right;
    padding-right: 54px;
}
.f-usercomment-down .f-usercomment-down-r {
    float: right;
    position: relative;
}
.f-comment-publish-container .f-comment-publish{
    float: left;
}
.f-comment-publish-container .f-comment-publish .f-publish-btn{
    margin-right:-106px;
}
.video{
	width: 1200px;
	height: 508px;
	margin: 0 auto;
}
.videoPlay{
	width: 1200px;
	height: 508px;
}

.engMainnav-container{
	display: none;
}
</style>
  <div class="f-nav-detail">
        <detail-nav></detail-nav>
    </div>
<div  class="videoPlayCon">
        <div class="PlayTop">
            <ul>
            	<li style="cursor: pointer;" ng-show="showcons==1" ng-click="returnCompanyVideoList()">企业视频</li>
            	<div ng-hide="showcons==1">
                	<li><a ng-click="go()">工程e学堂</a><span ng-hide="showcons==1">></span></li>
                	 <li><a ng-click="golistOn(TopLink.category.topCategory.tcId)" ng-bind="TopLink.category.topCategory.tcName"></a><span>></span></li>
	                <li><a ng-click="golistTw(TopLink.category.topCategory.tcId,TopLink.category.secCategory.scId)" ng-bind="TopLink.category.secCategory.scName"></a><span>></span></li>
	                <li><a ng-click="golistTh(TopLink.category.topCategory.tcId,TopLink.category.secCategory.scId,TopLink.category.thirdCategory.dcId)" ng-bind="TopLink.category.thirdCategory.dcName"></a><span>></span></li>
	                <li><a ng-bind="courseTit"></a><span></span></li>
                </div>
               
            </ul>

        </div>
    </div>
        <div class="PlayVideo">
            <!--视频存放处-->
            <div class="video">
	         <div ng-if="videoInfo" playvideo need="videoInfo" ></div>
           
            </div>
            <!--视频侧边栏-->
            <div class="showVideo"  ng-click="showMenu()"></div>
            <div class="videMenu" >
                <h1>
                    <a ng-click="tab=1" ng-class="{'PlayBot':tab==1}" class="PlayDetail " href="javascript:;">详情</a>
                    <a  ng-hide='showcons==1' ng-click="tab=2" ng-class="{'PlayBot':tab==2}" class="PlayCatalog" href="javascript:;">目录</a>
                </h1>
                <p class="videoMark" ng-click="hideMenu()"></p>
                <div ng-show="tab==1" class="videoDetails">
                    <p ng-hide="showcons==1" class="details" ng-bind="introduction">

                    </p>
                    <p style="margin-left: 20px;margin-top: 10px;" ng-show="showcons==1">
                    	暂无简介
                    </p>
                </div>
                <div ng-show="tab==2" class="catalogCon">
                    <div class="chapter" >

                        <div  class="cataSwitch" ng-repeat="item in course track by $index" class="chapter" >
                            <div style="width:100%;height: 24px;background:#fff;margin-bottom:-3px ;"></div>
                            <div class="chapterTop" >
                               <span class="Bigchaper">
                                    第<b style="font-weight: normal;" ng-bind="$index+1|Chinese"></b>章
                               </span>
                                <span>{{ item.chapterName }}</span>
                            </div>
                            <div style="width:100%;height: 24px;background:#fff;margin-bottom:-3px ;"></div>
                            <div ng-repeat="childItem in item.childChapterList track by $index"  class="course">
                                <span class="chaperName">第<b style="font-weight: normal;" ng-bind="$index+1|Chinese"></b>节</span><a>{{ childItem.chapterName }}</a>
                                <span class="videoname" ng-repeat="timeItem in childItem.videoList">
                                 	<i class="iconfont" style="color: #30a3ff;font-size:18px;padding-right: 21px;">&#xe609;</i>
                                 	<b style="font-weight: normal;"ng-bind="timeItem.videoName" ng-click="goTovideo(timeItem)"></b>
                                 	<b class="videoTime" ng-bind="timeItem.videoTime"></b>
                                 </span>
                            </div>
                        </div>


                    </div>
                </div>
            </div>
        </div>
    <!--底部视频-->
    <div class="videoPlayCon">
        <div class="RevelanVideoCon">
            <div class="RevelanVideo">
                <h1>相关课程</h1>
                <ul ng-hide='showcons==1'  class="SameVideoCon">
                    <li  ng-repeat="item in SameVideoCon track by $index" ng-click="switchDea(item)">
                        <a ><img src="them/imgs/noSrc.png" ng-src="{{ item.previewPath }}" /></a>
                        <p ng-bind="item.title"></p>
                    </li>
                     
                </ul>
                <ul class="SameVideoCon" ng-show='showcons==1' >
                	<li  ng-repeat="item in SameVideoCon track by $index" ng-click="switchDea2(item)">
                        <a ><img src="them/imgs/noSrc.png" ng-src="{{ item.previewPath }}" /></a>
                        <p ng-bind="item.title"></p>
                    </li>
                </ul>
            </div>

            <div ng-hide='showcons==1' class="evaluateCon">
                <div class="evaCenter">
                    <!--评论-->
                    <div class="evaCon">
                        <div i-comment  comment-conf="commentConf" ></div>
                    </div>
                </div>
            </div>
    </div>
        <div class="recentBrowse">
            <h1>最近浏览</h1>
            <ul class="videoCon">
            	<li ng-repeat="item in recentCon track by $index" class="ng-scope">
            		
                <a ng-show="item.typeName=='file';" ng-click="goworkData(item.bId)" ng-bind="item.title"></a>
                <a ng-show="item.typeName=='course'" ng-click="LinkCourse(item.bId)" ng-bind="item.title"></a>
                 <a ng-show="item.typeName=='news'" ng-click="goNews(item.bId)" ng-bind="item.title"></a>
                 <a ng-show="item.typeName=='library'" ng-click="Linklibrary(item.bId)" ng-bind="item.title"></a>
                 <a ng-show="item.typeName=='postbar'" ng-click="goanswer(item.bId)" ng-bind="item.title"></a> 

            </li>
            </ul>
        </div>
    </div>









